<template>
  <q-card
    flat
    v-show="data"
  >
    <q-card-section>
      <div class="text-h6 row no-wrap items-center">
        <div class="ellipsis text-capitalize">{{data.name}}</div>
        <div class="q-space"></div>
      </div>
    </q-card-section>
    <q-card-section class="text-bold q-pb-none">
      {{measurement.value}}
    </q-card-section>
    <q-card-section>
      {{data.description}}
    </q-card-section>
  </q-card>
</template>

<script>
import axios from 'axios'
export default {
  name: 'StartTime',
  data () {
    return {
      data: {},
      measurement: {}
    }
  },
  mounted () {
    this.onRefresh()
  },
  methods: {
    onRefresh () {
      const response = {}
      response['data'] = {
        "name": "system.cpu.usage",
        "description": "The \"recent cpu usage\" for the whole system",
        "measurements": [{
          "statistic": "VALUE",
          "value": 0.011056511056511056
        }],
        "availableTags": []
      }
      this.measurement = response.data.measurements[0]
      // axios.get('/actuator/metrics/process.start.time', {}).then(response => {
      //   this.data = response.data
      //   this.measurement = response.data.measurements[0]
      // })
    }
  },
  computed: {
    // progressLabel () {
    //   return (this.progress * 100).toFixed(2) + '%'
    // }
  }
}
</script>

<style lang="sass" scoped>

</style>
